// 1.新建文件 router/index.js
// 2.把路由相关的代码拷贝到此文件中
// 3.路由对象导出
// 4.main.js导入路由对象

import Vue from 'vue'
// 脚手架环境下 @符号 指代的就是src目录
import Find from "@/views/Find"
import My from "@/views/My"
import Friend from "@/views/Friend"


// 1.安装Vue-router npm i vue-router@3.6.5
// 2.导入import VueRouter from 'vue-router'
// 3.注册 Vue.use(VueRouter)
// 4.创建VueRouter实例
// 5.注入到Vue实例中
import VueRouter from 'vue-router'
Vue.use(VueRouter)
// 配置路由规则，在new VueRouter的时候进行配置
const router = new VueRouter({
  // routes对应的路由规则的集合
  routes: [
    // 数组中的每一条就是一个路由规则
    // 路由规则的作用：把路径和组件映射（对应）起来
    // path就是访问的路径
    // component: 就是访问路径时对应渲染的组件
    { path: "/find", component: Find },
    { path: "/my", component: My },
    { path: "/friend", component: Friend },
  ]
})

export default router